<template>
  <div class="lastest">
    <div class="lastest-title">
      <img class="img11" src="@/assets/img/badone.png" />
      <span>投资人少踩坑，就是企业多赚钱</span>
    </div>
    <div class="lastest-item" v-for="item of lastestList" :key="item.id">
      <div class="lastest-item-img">
        <img class="item-img" :src='item.imgUrl' />
      </div>
      <div class="lastest-item-info">
        <p class="item-title">{{item.title}}</p>
        <p class="addtime">发布时间：{{item.addtime}}</p>
        <p class="item-desc">{{item.desc}}</p>
        <button class="item-button">查看详情</button>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'HomeLastest',
  data () {
    return {
      lastestList: [{
        id: '0001',
        imgUrl: 'src/assets/img/lastest.jpg',
        title: '光谷500亩高端居住用地转让',
        desc: '该地块被投资圈人士誉为十大神地之首，尽管已经有百强房企接手，但是问题依旧多，原土地所有者企图二次转让',
        addtime: '2019年5月10日'
      }, {
        id: '0002',
        imgUrl: "require('@/assets/img/lastest.jpg')",
        title: '后官湖200亩高端居住用地转让',
        desc: '黄石市2019年度重点推介地块，地价地，规模大，区域景观优势明显，公共设施配套现代超前',
        addtime: '2019年5月10日'
      }, {
        id: '0003',
        imgUrl: "require('@/assets/img/lastest.jpg')",
        title: '华科西门300亩宅地18亿元转让',
        desc: '黄石市2019年度重点推介地块，地价地，规模大，区域景观优势明显，公共设施配套现代超前',
        addtime: '2019年5月10日'
      }, {
        id: '0004',
        imgUrl: "require('@/assets/img/lastest.jpg')",
        title: '蔡甸120亩纯住宅用地楼面价4000转让',
        desc: '黄石市2019年度重点推介地块，地价地，规模大，区域景观优势明显，公共设施配套现代超前',
        addtime: '2019年5月10日'
      }]
    }
  }
}
</script>

<style lang="stylus" scoped>
  .lastest
    width: 1280px
    height: 285px
    margin: 0 auto
    .lastest-title
      width: 1280px
      height: 40px
      background: #00bcd4
      font-size: 18px
      font-weight: bold
      line-height: 30px
      color: #fff
      .img11
        margin-top: -5px
    .lastest-item
      width: 630px
      height: 120px
      border-bottom: 1px solid #ccc
      margin-left: 4px
      margin-right: 4px
      margin-bottom: 5px
      float: left
      .lastest-item-img
        width: 180px
        height: 120px
        float: left
        .item-img
          width: 180px
          height: 120px
      .lastest-item-info
        width: 450px
        height: 120px
        float: left
        .item-title
          width: 440px
          height: 30px
          line-height: 30px
          font-size: 16px
          font-weight: bold
          margin-left: 10px
          overflow: hidden
          white-space: nowrap
          text-overflow: ellipsis
        .addtime
          width: 440px
          margin-left: 10px
          height: 30px
          line-height: 30px
          font-size: 15px
          font-weight: bold
        .item-desc
          width: 440px
          margin-left: 10px
          height: 30px
          line-height: 30px
          font-size: 14px
          overflow: hidden
          white-space: nowrap
          text-overflow: ellipsis
        .item-button
          width: 100px
          height: 20px
          margin-left: 10px
          line-height: 20px
          font-size: 14px
          background: #00bcd4
          margin-top: 5px
          color: #fff
</style>
